import React from "react";

//useSelector是获取redux中的数据,useDispatch：调用redux中的各种reducers修改方法
import { useSelector, useDispatch } from "react-redux";
import { add, jian, changeValue } from "../../store/count";

export default function FooterControl(props) {
  const countState = useSelector((state) => state.counter);
  const dispatch = useDispatch();

  return (
    <div>
      <div>全选</div>
      <div>任务数:{props.len}</div>
      <h2>演示redux</h2>
      <div>
        {countState.num}--{countState.token}
      </div>
      <div className="btn">
        <button
          onClick={() => {
            dispatch(add());
          }}
        >
          加
        </button>
        <button
          onClick={() => {
            dispatch(jian());
          }}
        >
          减
        </button>
        <button
          onClick={() => {
            dispatch(changeValue(5));
          }}
        >
          改变值
        </button>
      </div>
    </div>
  );
}
